// createRouter：创建router实例对象
// createWebHistory：创建history模式的路由
import { createRouter, createWebHistory } from "vue-router";

import Login from "@/views/login/index.vue";
import Layout from "@/views/layout/index.vue";
import Home from "@/views/home/index.vue";
import Category from "@/views/category/index.vue";
import SubCategory from "@/views/subcategory/index.vue";
import Detail from "@/views/detail/index.vue";
import CartList from '@/views/cartlist/index.vue';
import Checkout from '@/views/checkout/index.vue';
import Pay from '@/views/pay/index.vue';
import PayBack from '@/views/pay/payback.vue';
import Member from '@/views/member/index.vue';
import UserInfo from '@/views/member/components/userinfo.vue';
import UserOrder from '@/views/member/components/userorder.vue';

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),

  // 路由规则 -- path 和 component 的对应关系
  routes: [
    {
      path: "/",
      name: "首页",
      component: Layout,
      children: [
        {
          path: "/", // 与一级路由一致 ，会和一级路由一起渲染
          name: "主体",
          component: Home,
        },
        {
          path: "/category/:id",
          name: "分类",
          component: Category,
        },
        {
          path: "/category/sub/:id",
          name: "子分类",
          component: SubCategory,
        },
        {
          path: "/cartlist",
          name: "购物车",
          component: CartList,
        },
        {
          path: "/checkout",
          name: "结算",
          component: Checkout,
        },
        {
          path: "/pay",
          name: "支付",
          component: Pay,
        },
        {
          path: "/paycallback",
          name: "支付回调",
          component: PayBack,
        },
        {
          path: "/member",
          name: "会员中心",
          component: Member,
          children: [
            {
              path: "/member/order",
              name: "我的订单",
              component: UserOrder,
            },
            {
              path: "",
              name: "个人资料",
              component: UserInfo,
            },
          ],
        },
      ],
    },
    {
      path: "/detail/:id",
      name: "详情",
      component: Detail,
    },
    {
      path: "/login",
      name: "登录",
      component: Login,
      // route level code-splitting
      // this generates a separate chunk (About.[hash].js) for this route
      // which is lazy-loaded when the route is visited.
      //component: () => import('../views/AboutView.vue'),
    },
  ],
  // 滚动行为
  scrollBehavior() {
    // always scroll to top
    return { top: 0 };
  },
});

export default router;
